<template>
    <div>
        <el-dialog
                :title="!dataForm.id ? '查看评价' : '查看评价'"
                :close-on-click-modal="false"
                :visible.sync="visible">
            <el-table
                    :data="dataList"
                    border
                    v-loading="dataListLoading"
                    @selection-change="selectionChangeHandle"
                    style="width: 100%;margin-top: 20px">
                <el-table-column
                        align="center"
                        type="index"
                        header-align="center"
                        label="ID">
                </el-table-column>
                <el-table-column
                        prop="realName"
                        header-align="center"
                        align="center"
                        label="姓名">
                </el-table-column>
                <el-table-column
                        prop="content"
                        header-align="center"
                        align="center"
                        label="评价内容">
                </el-table-column>
                <el-table-column
                        prop="checkStatus"
                        header-align="center"
                        align="center"
                        label="审核">
                    <template slot-scope="scope">
                        <el-tag v-if="scope.row.checkStatus === 0">未审核</el-tag>
                        <el-tag v-if="scope.row.checkStatus === 1">通过</el-tag>
                        <el-tag v-if="scope.row.checkStatus === 2">不通过</el-tag>
                    </template>
                </el-table-column>
                <el-table-column
                        prop="createTime"
                        header-align="center"
                        align="center"
                        label="评价时间">
                </el-table-column>
                <el-table-column
                        prop="updateTime"
                        header-align="center"
                        align="center"
                        label="更新时间">
                </el-table-column>
                <el-table-column
                        fixed="right"
                        header-align="center"
                        align="center"
                        label="操作">
                    <template slot-scope="scope">
                        <el-button type="text" @click="examine(scope.row.id,scope.row.checkStatus)">审核
                        </el-button>
                    </template>
                </el-table-column>
            </el-table>
            <el-pagination
                    @size-change="sizeChangeHandle"
                    @current-change="currentChangeHandle"
                    :current-page="pageIndex"
                    :page-sizes="[10, 20, 50]"
                    :page-size="pageSize"
                    :total="totalPage"
                    layout="total, sizes, prev, pager, next, jumper">
            </el-pagination>
            <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">取消</el-button>
      <el-button type="primary" @click="dataFormSubmit()" :loading="loading">确定</el-button>
    </span>
        </el-dialog>
        <exam v-if="examVisible" ref="exam" @refreshDataList="getDataList"></exam>
    </div>
</template>

<script>
  import Exam from './exam'

  export default {
    data () {
      return {
        visible: false,
        dataListLoading: false,
        examVisible: false,
        pageIndex: 1,
        pageSize: 10,
        totalPage: 0,
        dataList: [],
        records: [],
        dataForm: {
          trainId: 0
        },
        loading: false
      }
    },
    components: {
      Exam
    },
    methods: {
      getDataList () {
        this.dataListLoading = true
        this.$nextTick(() => {
          if (this.dataForm.trainId) {
            this.$http({
              url: this.$http.adornUrl(`/train/traindata/getTrainCommentList`),
              method: 'post',
              data: {
                'trainId': this.dataForm.trainId
              }
            }).then(res => {
              if (res && res.code === 200) {
                this.dataList = res.data.list
                this.totalPage = res.data.totalCount
              } else {
                this.dataList = []
              }
              this.dataListLoading = false
            })
          }
        })
      },
      init (id) {
        this.dataForm.trainId = id || 0
        this.visible = true
        this.getDataList()
      },
      examine (id, checkStatus) {
        this.examVisible = true
        this.$nextTick(() => {
          this.$refs.exam.init(id, checkStatus)
        })
      },
      sizeChangeHandle (val) {
        this.pageSize = val
        this.pageIndex = 1
        this.getDataList()
      },
      currentChangeHandle (val) {
        this.pageIndex = val
        this.getDataList()
      },
      // 多选
      selectionChangeHandle (val) {
        this.dataListSelections = val
      }
    }
  }
</script>

<style scoped>

</style>
